/**
 * 绘制多边形
 * @param {Earth} options.earth 多边形的渲染容器
 * @param {Array} options.positions 多边形轮廓数据 [ lng, lat, lng, lat... ]
 * @param {Array} options.color 多边形填充颜色 colorArray
 * @param {Array} options.outlineColor 多边形轮廓颜色 colorArray
 * @param {Number} options.outlineWidth 多边形轮廓宽度
 * @param {Boolean} options.outlineShow 多边形轮廓是否显示
 * @param {Number} options.extrudedHeight 多边形的拉伸高度
 * @param {Boolean} options.ground 是否贴地
 * @param {Number} options.height 多边形离地面高度 单位米
 * @param {Array} options.holePositions 多边形内部镂空轮廓 
 * @param {Boolean} options.creatingWithoutHeight 是否在三维窗口中进行点增加的编辑（不编辑高度)
 * @param {Boolean} options.changeStatus 是否可编辑属性
 * @param {object} options.data 临时数据存放
 * 
 * @methods update(options) 更新多边形数据
 * @methods onclick() DrawPolygon点击事件 this.update更新数据  this.polygon 为 XE.Obj.Polygon 原始对象
 * 
 * @returns {Polygon} Polygon实例
 */
function DrawPolygon (options) {
    let radian = Math.PI / 180;

    this.type = 'DrawPolygon'
    this.colorA = options.color[3]
    this.outlineColorA = options.outlineColor[3]
    let color = options.color || [ 1, 1, 1, 0.5 ]
    let outlineColor = options.outlineColor || [ 1, 1, 1, 1 ]

    if (options.aniInit) {
        color[3] = 0
        outlineColor[3] = 0
    }

    let objConfig = {
        positions: options.positions.map(item => {
            return item * radian
        }),
        color: color,
        outline: {
            color: outlineColor,
            width: options.outlineWidth === undefined ? 1 : options.outlineWidth,
            show: options.outlineShow === undefined ? true : options.outlineShow
        },
        extrudedHeight: options.extrudedHeight || null,
        ground: options.ground === undefined ? true : options.ground,
        height: options.height || 0,
        creatingWithoutHeight: options.creatingWithoutHeight || false,
        holePositions: options.holePositions || []
    }
    let polygon = new XE.Obj.Polygon(options.earth);
    polygon.xbsjFromJSON(objConfig);

    polygon._node = this
    this.XEObj = polygon
    this.data = options.data || null
    this.changeStatus = options.changeStatus === undefined ? true : options.changeStatus
    // return polygon;

    if (options.aniInit) {
        this.timerFun(options)
    }
}

DrawPolygon.prototype.update = function (options) {
    if (!this.changeStatus) {
        return
    }
    for (let k in options) {
        if (k == 'outlineColor') {
            let color = this.XEObj.outline
            color.color = options[k]
        }else if (k == 'outlineWidth') {
            let color = this.XEObj.outline
            color.width = options[k]
        }else if ( k == 'outlineShow') {
            let color = this.XEObj.outline
            color.show = options[k]
        }else if (k == 'changeStatus') {
            this[k] = options[k]
        } else {
            this.XEObj[k] = options[k]
        }
    }
}

DrawPolygon.prototype.timerFun = function (options) {
    let colorNum = this.colorA / 50
    let outlineColorNum = this.outlineColorA / 10
    let XEObj = this.XEObj
    let index = 0
    let that = this

    ani()

    function ani () {
        that.timer = requestAnimationFrame(() => {
            XEObj.color[3] = colorNum * index
            XEObj.outline.color[3] = outlineColorNum * index
            index ++
            if (index >= 50) {
                cancelAnimationFrame(that.timer)
            } else {
                ani()
            }
        })
    }
},

DrawPolygon.prototype.click = function () {
    if (this.onclick) { this.onclick() }
}

DrawPolygon.prototype.destroy = function () {
    if (this.timer) {
        cancelAnimationFrame(this.timer)
    }
    this.XEObj._node = null
    this.XEObj.destroy()
}

DrawPolygon.prototype.setShow = function (options) {
    this.XEObj.show = options
}

export default DrawPolygon